<!-- 仓库管理 -->
<template>
  <div>
    <el-card class="box-card content">
      <el-form :inline="true" label-position="top" label-width="80px" :model="formLabelAlign">
        <el-row :gutter="50">
          <el-col :span="6">
            <el-form-item label="仓库名称" style="width:100%">
              <el-input v-model="formLabelAlign.name" placeholder="请输入" />
            </el-form-item>
          </el-col>
          <el-col :span="6">
            <el-form-item label="库区名称" style="width:100%">
              <el-input v-model="formLabelAlign.region" placeholder="请输入" />
            </el-form-item>
          </el-col>
          <el-col :span="6">
            <el-form-item label="仓库状态">
              <el-select v-model="value" placeholder="请选择" class="size">
                <el-option
                  v-for="item in options"
                  :key="item.value"
                  :label="item.label"
                  :value="item.value"
                />
              </el-select>
              <!-- <el-input v-model="formLabelAlign.type" placeholder="请选择" /> -->
            </el-form-item>
          </el-col>
          <el-col :span="6">
            <el-form-item class="maginT" style="width:100%">
              <el-button type="warning" round @click="submit">搜索</el-button>
              <el-button round>重置</el-button>
            </el-form-item>
          </el-col>
        </el-row>
      </el-form>
    </el-card>
    <el-table
      :data="tableData"
      border
      style="width: 100%"
    >
      <el-table-column
        fixed
        type="index"
        label="序号"
        width="150"
      />
      <el-table-column
        prop="code"
        label="仓库编码"
        width="120"
      />
      <el-table-column
        prop="name"
        label="仓库名称"
        width="120"
      />
      <el-table-column
        prop="type"
        label="仓库类型"
        width="120"
      />
      <el-table-column
        prop="location"
        label="省/市/区"
        width="300"
      />
      <el-table-column
        prop="address"
        label="详细地址"
        width="120"
      />
      <el-table-column
        prop="status"
        label="仓库状态"
        width="120"
      />
      <el-table-column
        prop="surface"
        label="仓库面积m²"
        width="120"
      />
      <el-table-column
        prop="includeNum"
        label="库存数量"
        width="120"
      />
      <el-table-column
        prop="personName"
        label="负责人"
        width="120"
      />
      <el-table-column
        prop="phone"
        label="联系电话"
        width="120"
      />
      <el-table-column
        prop="updateTime"
        label="更新时间"
        width="120"
      />
      <el-table-column
        fixed="right"
        label="操作"
        width="100"
      >
        <template slot-scope="scope">
          <el-button type="text" size="small" @click="handleClick(scope.row)">查看</el-button>
          <el-button type="text" size="small">编辑</el-button>
        </template>
      </el-table-column>
    </el-table>

  </div>
</template>

<script>
import { getWarehouse } from '@/api/warehouse'
export default {
  data() {
    return {
      list: {
        current: 1,
        size: 10
        // descs: 'createTime'
      },
      tableData: [],
      formLabelAlign: {
        name: '',
        region: '',
        type: ''
      },
      options: [
        {
          value: '选项1',
          label: '全部'
        },
        {
          value: '选项2',
          label: '停用'
        },
        {
          value: '选项3',
          label: '启用'
        }
      ],
      value: ''
    }
  },
  async created() {
    const { data } = await getWarehouse(this.list)
    console.log(data)
    this.tableData = data.data
  },
  methods: {
    submit() {

    }
  }
}

</script>
<style lang='scss' scoped>
.box-card {
    width: 1617px;
    margin: 0 auto;
    border-radius: 12px;
  }
.content {
  margin-top: 30px;
}
.size {
  width: 378.75px;
}
.maginT{
  margin-top: 50px;
  margin-left: 200px;
}
</style>
